<script>
export default {
  props: {
    title: '卡片标题',
    isLink: true,
    currentData: {}, // todo 列表中当前卡片需要展示的数据。在渲染 cell 的时候需要用到这个数据，是这样传递的吗？
    cells: [
      {
        label: '字段描述',
        field: '字段名称',
        hide: ['card']
      }
    ]
  },
  computed: {},
  render(h) {
    return (
      <yt-card
        btn={this.isLink ? '查看更多' : ''}
        edge={false}
        tag={false}
        title={this.title}
      >
        {this.renderCells(h)}
      </yt-card>
    )
  },
  methods: {
    renderCells(h) {
      return this.cells.map((item, index) => {
        return (
          <yt-cell
            border={false}
            label={item.label}
            value={this.data[item.field]}
          />
        )
      })
    }
  }
}
</script>

<style lang="stylus" scoped>
>>>.yt-cell {
  align-items: flex-start;
}

>>>.yt-cell-label {
  padding: 0;
}

>>>.yt-cell-value {
  line-height: 30px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
}
</style>